import React from 'react'
import { Routes, Route, Navigate, BrowserRouter } from 'react-router-dom'
import { lazy, Suspense } from 'react'
import routes from './router/router.ts'
import './index.css'
const App = () => {
  return (
    <Suspense>
      <BrowserRouter>
        <Routes>
          {
            routes && routes.map((item, index) => {
              return <Route key={index} path={item.path} element={item.element ? <item.element></item.element> : <Navigate to={item.to}></Navigate>}>
                {
                  item.children && item.children.map((item, index) => {
                    return <Route key={index} path={item.path} element={item.element ? <item.element></item.element> : <Navigate to={item.to}></Navigate>}>
                      {

                      }
                    </Route>
                  })
                }
              </Route>
            })
          }
        </Routes>
      </BrowserRouter>
    </Suspense>
  )
}

export default App
